<template>
<div class="proAnalysis">
  <div class="header">
    <span class="line"></span>
    <div class="text">盈亏分析</div>
    <span class="line"></span>
  </div>
  <div class="button">
    <div class="left" @click='tabSelect(0)' :class="{'activeBlue':selectedIndex==0,'activeWhite':selectedIndex==1}">股票盈亏</div>
    <div class="right" @click='tabSelect(1)' :class="{'activeBlue':selectedIndex==1,'activeWhite':selectedIndex==0}">理财盈亏</div>
  </div>

  <top3 :time-index = "fathertime" :category = "selectedIndex" :type = "0"></top3>
  <top3 :time-index = "fathertime" :category = "selectedIndex" :type = "1"></top3>

</div>
</template>

<script>
import Top3 from './Top3'

export default {
  props: ['fathertime', 'tData'],
  data() {
    return {
      selectedIndex: 0,
      setProIndex:0,
      clickStatus:0
    }
  },
  created() {
    this.setProIndex = this.$store.state.proAnalysisIndex;
    this.tabSelect(this.setProIndex)
  },
  components: {
    Top3
  },
  methods: {
    tabSelect(index) {
      this.selectedIndex = index;

      this.$store.dispatch('setProAnalysisIndex', index);

      if(this.clickStatus == 1 && index == 0){
        TDAPP.onEvent('002013', '');
        TDAPP.send();
        this.clickStatus = 0
      }
      if(this.clickStatus == 0 && index == 1){
        TDAPP.onEvent('002014', '');
        TDAPP.send();
        this.clickStatus = 1
      }
    }
  }
}
</script>
<style scoped>
</style>
